<script setup lang="ts">
  import { refreshInjectKey } from '@/composables/useRouterViewRefresh'
  import { inject } from 'vue'

  const showView = inject(refreshInjectKey)
</script>

<template>
  <n-layout-content :native-scrollbar="false" class="pear-admin-content">
    <router-view v-slot="{ Component }">
      <template v-if="Component">
        <transition name="fade-top">
          <component v-if="showView" :is="Component" />
        </transition>
      </template>
    </router-view>
  </n-layout-content>
</template>

<style scoped lang="less">
  .pear-admin-content {
    @apply h-full;
    min-height: calc(100vh - 140px);
  }
  .app-loading {
    @apply w-full min-h-screen flex flex-col justify-center items-center;
  }
</style>
